<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>图片切换</title>
		<style type="text/css">
			#photo{
				width: 100px;
				height: 100px;
				margin: 50px auto;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<div id="photo">
			<!-- <p id="pid"></p> -->
			<img src="img/图片切换/1.jpg" id="imgid1" >
			<br/>
			<button type="button" onclick="btnBegin(event);">开始</button>
		</div>
	</body>
	<script type="text/javascript">
		function btnBegin(event){
			var imgid1 = document.getElementById('imgid1');
			
			setInterval(function(){
				var num = getnum();
				imgid1.src = "img/图片切换/" + num + ".jpg";
			},500)
			
			var num = 1;
			var interval = setInterval(function(){
				imgid1.src = "img/图片切换/" + num + ".jpg";
				console.log(num);
				if (num == 9) {
					clearInterval(interval);
				}
				num++;
			},500)
			// var img = document.getElementsByTagName('img')[0];
			// var imgarr = ["img/图片切换/1.jpg","img/图片切换/2.jpg","img/图片切换/3.jpg","img/图片切换/4.jpg","img/图片切换/5.jpg","img/图片切换/6.jpg","img/图片切换/7.jpg","img/图片切换/8.jpg","img/图片切换/9.jpg"]
			// var index = 0;
			// var pp = document.getElementById('pid')
			// pp.innerHTML = "共有"+imgarr.length+"张图片，当前为第"+(index+1)+"张";
		}
		function getnum(){
			var num = 0;
			while (true){
				num = Math.floor(Math.random()*10)
				if (num != 0) {
					break;
				}
			}
			return num;
		}
		
	</script>
</html>
